<!-- components/TabBar.vue -->
<template>
  <up-tabbar
		:value="currentTab"
		@change="onTabChange">
			<up-tabbar-item v-for="(item,index) in tabBarList" :text="item.title" :icon="item.icon" ></up-tabbar-item>
		</up-tabbar>
</template>

<script setup>
import useTabbarStore from '@/stores/tabbar/tabbar.js';
import { reactive, ref } from 'vue';
import { onMounted } from 'vue';

const tabbarStore = useTabbarStore();

const currentTab = ref(tabbarStore.getActive);
const tabBarList = reactive([
	{
		index: 0,
		title: '首页',
		icon: 'home',
		pagePath: '/pages/index/index',
	},
	{
		index: 1,
		title: '我的',
		icon: 'account',
		pagePath: '/pages/mine/mine',
	},
])

const onTabChange = (index) => {
	// 处理标签切换逻辑，如页面跳转、状态更新等
	tabbarStore.setActive(index);
	uni.switchTab({
		url: tabBarList[index].pagePath,
	})
}
</script>